<div>
  <ul id="template-tabs">
    <li class="nav-item">
      <a data-i18n="duplicate.tab.home" class="nav-link active" data-toggle="tab" href="#sieve-widget-duplicatetest"
        role="tab"></a>
    </li>
    <li class="nav-item">
      <a data-i18n="duplicate.tab.tracking" class="nav-link" data-toggle="tab" href="#sieve-widget-tracking"
        role="tab"></a>
    </li>
    <li class="nav-item">
      <a data-i18n="duplicate.tab.expiration" class="nav-link" data-toggle="tab" href="#sieve-widget-expiration"
        role="tab"></a>
    </li>
    <li class="nav-item">
      <a data-i18n="duplicate.tab.help" class="nav-link" data-toggle="tab" href="#sieve-widget-help" role="tab"></a>
    </li>
  </ul>

  <div id="template-content">
    <div class="tab-content m-2">
      <div class="tab-pane fade show active" id="sieve-widget-duplicatetest" role="tabpanel">

        <div class="mb-3">
          <h5 data-i18n="duplicate.unique.label"></h5>
          <div id="sivUnique"></div>
        </div>
      </div>
      <div class="tab-pane fade" id="sieve-widget-tracking" role="tabpanel">
        <p data-i18n="duplicate.tracking.text" class="form-text"></p>
        <div class="form-check">
          <input type="radio" id="sivDuplicateDefaultHandle" name="sieve-duplicate-handle" class="form-check-input"
            value="false" />
          <label data-i18n="duplicate.tracking.default" class="form-check-label"
            for="sivDuplicateDefaultHandle"></label>
        </div>
        <div class="form-check">
          <input type="radio" id="sivDuplicateCustomHandle" name="sieve-duplicate-handle" class="form-check-input"
            value="true" />
          <label class="form-check-label" for="sivDuplicateCustomHandle">
            <form class="was-validated" novalidate="novalidate">
              <input data-i18n="duplicate.tracking.custom" type="text" value="${sender} ${subject}" id="sivDuplicateHandle" required="required"/>
              <div data-i18n="duplicate.tracking.custom.invalid" class="invalid-feedback"></div>
            </form>
          </label>
        </div>
      </div>
      <div class="tab-pane fade" id="sieve-widget-expiration" role="tabpanel">
        <h5 data-i18n="duplicate.expiration.title"></h5>

        <div class="form-check">
          <input type="radio" id="sivDuplicateDefaultExpiration" name="sieve-duplicate-seconds"
            class="form-check-input" value="false" />
          <label data-i18n="duplicate.expiration.default" class="form-check-label"
            for="sivDuplicateDefaultExpiration"></label>
        </div>
        <div class="form-check">
          <input type="radio" id="sivDuplicateCustomExpiration" name="sieve-duplicate-seconds"
            class="form-check-input" value="true" />
          <label class="form-check-label" for="sivDuplicateCustomExpiration">
            <form class="was-validated" novalidate="novalidate">
              <span data-i18n="duplicate.expiration.custom.pre"></span>
              <input type="number" min="0" id="sivDuplicateSeconds" value="600" required="required"/>
              <span data-i18n="duplicate.expiration.custom.post"></span>
              <div data-i18n="duplicate.expiration.custom.invalid" class="invalid-feedback"></div>
            </form>
          </label>
        </div>

        <br />

        <p class="form-text" data-i18n="duplicate.time.text"></p>
        <div class="form-check">
          <input type="radio" id="sivDuplicateEntryCreated" name="sieve-duplicate-last" class="form-check-input"
            value="false" />
          <label class="form-check-label" for="sivDuplicateEntryCreated" data-i18n="duplicate.time.created"></label>
        </div>
        <div class="form-check">
          <input type="radio" id="sivDuplicateEntryAccessed" name="sieve-duplicate-last" class="form-check-input"
            value="true" />
          <label class="form-check-label" for="sivDuplicateEntryAccessed"
            data-i18n="duplicate.time.accessed"></label>
        </div>
      </div>
      <div style="white-space: pre-line" class="tab-pane fade form-text" id="sieve-widget-help" role="tabpanel"
        data-i18n="duplicate.help"></div>
    </div>
  </div>
</div>